<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<script src="./js/jq3.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/mui.js"></script>
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="css/common.css" />

		<style type="text/css">
			.app-title {
				font-size: 2rem;
				text-align: center;
				width: 96%;
				margin: 8px auto;
			}

			.app-title img {
				height: 34px;
				width: auto;
				border-radius: 50%;
			}

			.footer-nav {
				height: 45px;
				/* width: 45px; */
				line-height: 45px;
				text-align: center;
			}
		</style>

		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>
	<body>
		<div class="head">
			<div class="app-title">
				<span id="appTitle">韦海鹏的丰功伟绩</span>
				<img id="headPIC" src="./img/213.jpg">
			</div>

		</div>

		<div class="main">

		</div>

		<div class="footer">
			<div class="footer-nav" id="pages_welcome">首页</div>
			<div class="footer-nav" id="pages_dog">阿狗</div>
			<div class="footer-nav" id="pages_info">写东西</div>
			<div class="footer-nav" id="pages_cat">阿猫</div>

		</div>
	</body>
</html>

<script type="text/javascript">
	let __views = {};
	let __centerHight = 600;

	let __is_login = false; // 测试, 登陆状态


	// 1. 认识plus 
	// plusready事件, 安全的调用plus 
	if (window.plus) {
		plusReady();
	} else {
		document.addEventListener('plusready', plusReady, false);
	}
	// 
	function plusReady() {
		// console.info("plusReady~" + window.innerHeight); 
		init_path();

		init_main(); // 初始化样式
		init_event(); // 初始化事件
		checkLogin(); // 判断登陆状态	
	}


	function init_path() {
		var path_doc = "_doc/";
		plus.io.resolveLocalFileSystemURL(path_doc, (res) => {
			plus.storage.setItem("path_doc", res.fullPath);
		}, (err) => {});

		var path_www = "_www/";
		plus.io.resolveLocalFileSystemURL(path_www, (res) => {
			console.info(res.fullPath)
			plus.storage.setItem("path_www", res.fullPath);
		}, (err) => {});
	}


	// 1.中间区域的高度重新适应
	function init_main() {
		// 初始化中间区域高度
		__centerHight = window.innerHeight - 90 || "40rem";
		// console.info(__centerHight)
		$(".main").css({
			height: __centerHight + "px"
		});
	}

	// 初始化事件
	function init_event() {
		// 底部导航按钮的事件
		$(".footer-nav").click(function() {
			if (!__is_login) {
				return;
			}
			var tab_id = this.id;
			toNewPage(tab_id, true);
		})

	}

	// 打开新页面 - tab_id 代表页面地址, flag 表示是否是独占的页面, 默认true 
	function toNewPage(tab_id, flag) {
		flag = flag || true;
		// 关掉其他窗口, !!!! 以及这些窗口下的子窗口!!! 
		// 处理 - 子窗口关闭, 父窗口隐藏.
		for (var x in __views) {
			__views[x].hide();
		}
		// 判断该打开谁
		var pageName = tab_id.replace("pages_", "");

		console.info("pageName ----- " + pageName)

		var parURL = "./" + tab_id.replace("_", "/") + ".html";
		// console.info(parURL);;
		// 没初始化过, 就创建
		if (!__views[pageName]) {
			// 填充第一个视窗/窗口
			__views[pageName] = plus.webview.create(parURL, pageName, {
				top: "45px", // 不要用margin-top
				width: "100%",
				height: __centerHight, // 数字 不用 px 
				// background: "#000000" // 不要用背景色!!! 背景色让内容去定
			});
			__views[pageName].addEventListener('loaded', function() {
				__views[pageName].show();
			}, false);
		}
		// 有则显示
		else {
			__views[pageName].show();
		}

		// 对welcom的额外处理 - 重置轮播图 - 
		// console.info(JSON.stringify(__views));
		if (pageName == "welcome") {
			__views["welcome"].evalJS('initSlider()');
		}
		// 列表页面重新刷新
		else if (pageName == "dog") {
			__views["dog"].evalJS('initList()');
		}


	}

	// 校验登陆状态 - 非登陆状态 - 跳转到登陆页面
	function checkLogin() {
		if (!__is_login) {
			__views["login"] = plus.webview.create("./pages/login.html", "login", {
				top: "45px", // 不要用margin-top
				width: "100%",
				height: __centerHight, // 数字 不用 px 
				// background: "#000000" // 不要用背景色!!! 背景色让内容去定
			});
			__views["login"].addEventListener('loaded', function() {
				__views["login"].show();
			}, false);
		} else {
			__views["login"].show();
		}
	}

	// 用户的详细信息应该传过来, 头像地址, opid , 昵称 ...
	function doLogin() {
		__is_login = true;
		var user_info = JSON.parse(plus.storage.getItem("userInfo"));
		$("#headPIC")[0].src = user_info.headimgurl;
		$("#appTitle").text(user_info.nickname + " ~~~~ 来了");
		$("#pages_welcome").click();
	}
</script>
